*{
  font-family: 'Poppins', sans-serif;
  margin: 0;
  padding: 0;
}

.rowcontenedor{
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
}

section{
  display: flex;
  justify-content: center; /* Centra horizontalmente */
  align-items: flex-start; /* Alinea arriba verticalmente */
  width: 100%;
  min-height: 90vh;
  background-color: #0077B6;
  /*background: url("https://wallpapers-clan.com/wp-content/uploads/2023/11/beautiful-comets-in-the-sky-desktop-wallpaper-preview.jpg") no-repeat;*/
  background-position:center;
  background-size: cover;
  margin: 50;
}

.contenedor{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  color: #023E8A;
}

.contenedor h2{
  font-size: 2.3rem;
  text-align: center;
  color: #023E8A;
}

.contenedor a{
  color: #023E8A;
}

.input-contenedor{
  position: relative;
  margin: 30px 0;
  width: 300px;
}

.input-contenedor label{
  position: absolute;
  top: 50%;
  left: 5px;
  transform: translateY(-50%);
  font-size: 1rem;
  pointer-events: none;
  transition: .6s;
  font-family: bold;
}

input:focus ~ label,
input:valid ~ label{
  top: -10px;
}

.input-padding {
  padding-left: 10px; /* Puedes ajustar el valor según tus necesidades */
}

.input-contenedor input{
  color: #023E8A;
  border-radius: 5px;
  border: none;
  width: 100%;
  height: 50px;
  outline: none;
  font-size: 1rem;
  padding: -35px 10px 35px 10px;
}

.input-contenedor i{
  position: absolute;
  right: 10px;
  font-size: 1.6rem;
  color: #023E8A;
}

.alerta{
  font-size: 0.9rem;
  color: tomato;
  display: flex;
}

.olvidar{
  margin: -15px 0 15px;
  font-size: 0.9rem;
  color: white;
  display: flex;
  justify-content: center;
}

.olvidar label input{
  margin: 3px;
}

.olvidar label a{
  text-decoration: none;
  transition: .3s;
  font-size: .9em;
}

.olvidar label a:hover{
  text-decoration: underline;
}

button{
  width: 100%;
  height: 45px;
  border-radius: 5px;
  background-color: #023E8A;
  color: #fff;
  border: none;
  font-weight: bold;
  cursor: pointer;
  outline: none;
  font-size: 1rem;
  transition: .4s;
}

button:hover{
  opacity: .9;
}



.registrar{
  font-size: .8rem;
  text-align: center;
  margin: 20px 0 10px;
}

.registrar p a{
  text-decoration: none;
  font-weight: bold;
  transition: .3s;
}

.registrar p a:hover{
  text-decoration: underline;
}


/** Form **/
#form-width{width:50%;}
#form-container{
  border-radius: 20px;
  border: none;
  background-color: #fff;
  width:100%;
  max-width: fit-content;
  margin:20px 20px 20px 20px;
  padding:20px 20px 20px 20px;
}

/** Form image **/
#form-container .img-form{
  border: none;
  border-radius: 20px;
  width:80%;
  height:80%;
  display: flex;
  align-items: center;
  justify-content: center;
}
#form-container .img-form img{
  border: none;
  border-radius: 20px;
  width: 80%;
}

.imgbg{
    position: absolute;
    right: 10px;
    bottom: 40px;
    width: 351px;
    max-width: 25%;
}

@media only screen and (max-width: 750px) {
  .imgbg {
      display: none;
  }
}

img {
  overflow-clip-margin: content-box;
  overflow: clip;
}
img {
  border: 0;
}